<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org"
      xmlns:sec="http://www.thymeleaf.org/thymeleaf-extras-springsecurity3"
      xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">
<head th:replace="/common/head :: head" />
<body class="gray-bg">
<div class="wrapper wrapper-content animated fadeInRight">
<div class="row">
    <div class="col-sm-12">
        <div class="ibox float-e-margins">
            <div class="ibox-title">
                <h5>角色管理</h5>
            </div>
            <div class="ibox-content">
                <div class="row row-lg">
                    <div class="col-sm-12">
                        <div class="row">
                            <div class="col-sm-3">
                                <div class="input-group">
                                    <div class="input-group-btn">
                                        <button data-toggle="dropdown"
                                            class="btn btn-white dropdown-toggle" type="button">应用名称
                                        </button>
                                    </div>
                                    <input class="form-control" id="appName" type="text" readonly="readonly" onclick="Role.showAppSelectTree(); return false;" style="background-color: #ffffff !important;">
                                    <input class="form-control" id="appId" type="hidden">
                                </div>
                            </div>
                            <div class="col-sm-3">
                                <div class="input-group">
                                    <div class="input-group-btn">
                                        <button data-toggle="dropdown"
                                            class="btn btn-white dropdown-toggle" type="button">角色名称
                                        </button>
                                    </div>
                                    <input type="text" class="form-control" id="condition">
                                </div>
                            </div>
                            <div class="col-sm-3">
                                <button type="button" class="btn btn-primary" onclick="Role.search()">
                                    <i class="fa fa-search"></i>&nbsp;搜索
                                </button>
                                <button type="button" class="btn btn-primary button-margin" onclick="Role.resetSearch()" >
                                    <i class="fa fa-trash"></i>&nbsp;重置
                                </button>
                            </div>
                        </div>

                        <!-- 这是应用选择的下拉框 -->
                       <div id="appContent" style="display: none; position: absolute; z-index: 200;">
                           <ul id="appTree" class="ztree tree-box" style="width: 240px !important;"></ul>
                        </div>

                        <div class="hidden-xs" id="roleTableToolbar" role="group">
                            <button type="button" class="btn btn-primary" shiro:hasPermission ="/role/to_add" onclick="Role.openAddRole()">
                                <i class="fa fa-plus"></i>&nbsp;添加
                            </button>
                            <button type="button" class="btn btn-primary button-margin" shiro:hasPermission ="/role/to_update" onclick="Role.openEditRole()">
                                <i class="fa fa-edit"></i>&nbsp;修改
                            </button>
                            <button type="button" class="btn btn-primary button-margin" shiro:hasPermission ="/role/remove" onclick="Role.deleteRole()">
                                <i class="fa fa-remove"></i>&nbsp;删除
                            </button>
                            <button type="button" class="btn btn-primary button-margin" shiro:hasPermission ="/role/to_authorityAssign" onclick="Role.setAuthority()">
                                <i class="fa fa-user-secret"></i>&nbsp;权限配置
                            </button>
                        </div>
                        <table id="roleTable" data-mobile-responsive="true"
                            data-click-to-select="true">
                            <thead>
                                <tr>
                                    <th data-field="selectItem" data-checkbox="true"></th>
                                </tr>
                            </thead>
                        </table>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
</div>
<footer th:replace="/common/footer :: footer"></footer>
<script th:src="@{/js/system/role/role.js}"></script>
</body>
</html>
